<template>
<div>
    <van-nav-bar
  left-text="返回"
  left-arrow
  @click-left="onClickLeft"
/>
<van-form @submit="onSubmit">
 <van-field name="uploader" label="健康码上传、行程码上传：">
   <template #input>
  <van-uploader v-model="fileList" multiple :after-read="afterRead" />
  </template>
  </van-field>
  <br>
  <van-field name="uploader_a" label="行程码上传："> 
  <van-uploader_a v-model="fileList2" multiple :after-read="afterRead1" />
  </van-field>
  <div style="margin: 16px;">
    <van-button round block type="info" native-type="submit">提交</van-button>
  </div>
  </van-form>
</div>
</template>

<script>
import axios from "axios";
import { Toast } from "vant";
export default {

  data() {
    return {
      fileList: [],
       fileList2: [],
       icon: "",
    };

  },
        methods: {
    onSubmit(values) {
      console.log("submit", values);
    },
    onClickLeft() {
      this.$router.go(-1);
    },
    afterRead(file) {
      // 此时可以自行将文件上传至服务器
      console.log(file);
      const formDate = new FormData();
      formDate.append("image", file.file, file.file.name);
      let config = {
        headers: {
          "Content-Type": "multipart/form-data",
        },
      };
      axios
        .post("/api/upload.php", formDate, config)
        .then((res) => {
          console.log(res);
          this.user.icon = res.data.data.src;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    afterRead1(file) {
      // 此时可以自行将文件上传至服务器
      console.log(file);
      const formDate = new FormData();
      formDate.append("image", file.file, file.file.name);
      let config = {
        headers: {
          "Content-Type": "multipart/form-data",
        },
      };
      axios
        .post("/api/upload.php", formDate, config)
        .then((res) => {
          console.log(res);
          this.user.icon = res.data.data.src;
        })
        .catch((err) => {
          console.log(err);
        });
    },
      onSubmit(values) {
      console.log("submit", values);
      axios
        .post("/api/useradd.php", {
          name: this.user.name,
          age: this.user.age,
          type: this.user.type.id,
          birthday:this.user.birthday,
          icon: this.user.icon,
        })
        .then((response)=> {
          console.log(response);
          Toast.success('添加成功');
          this.$router.go(-1);
        })
        .catch((error) =>{
          console.log(error);
        });
    },
 
  },
};
</script>

<style>

</style>